<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/font/iconfont.css">
    <link rel="stylesheet" href="css/font1/iconfont.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/singer.css">
    <title>QQ音乐歌手</title>
</head>

<body>
    <!-- 头部 -->
    <header class="header w100">
        <div class="header-box w1600">
            <div class="header-nav">
                <div class="logo">
                    <a href="" class="logo-a">
                        <img src="images/logo.png" alt="" class="logo-pic">
                    </a>
                </div>
                <nav class="mainnav">
                    <ul class="mainnav-ul">
                        <li class="mainnav-li active">
                            <a href="" class="mainnav-a">音乐馆</a>
                        </li>
                        <li class="mainnav-li">
                            <a href="" class="mainnav-a">我的音乐</a>
                        </li>
                        <li class="mainnav-li mainnav-pop">
                            <a href="" class="mainnav-a">客户端
                                <img src="images/mark_1.png" alt="" class="mainnav-img">

                            </a>
                            <div class="pop-box">
                                <div class="pop-up">
                                    <ul class="pop-up-list">
                                        <li class="pop-up-items">
                                            <i class="pop-bg pop-up1"></i>
                                            <span class="pop-text">HQ高品质 全员开启</span>
                                        </li>
                                        <li class="pop-up-items">
                                            <i class="pop-bg pop-up2"></i>
                                            <span class="pop-text">独家音效 全面升级</span>
                                        </li>
                                        <li class="pop-up-items">
                                            <i class="pop-bg pop-up3"></i>
                                            <span class="pop-text">轻盈视觉 动态皮肤</span>
                                        </li>
                                        <li class="pop-up-items">
                                            <a href="" class="pop-update">下载体验</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </li>
                        <li class="mainnav-li">
                            <a href="" class="mainnav-a">开放平台</a>
                        </li>
                        <li class="mainnav-li">
                            <a href="" class="mainnav-a">VIP</a>
                        </li>
                    </ul>
                </nav>
                <!-- 搜索框 -->
                <div class="search">
                    <form action="">
                        <button class="btn-search"></button>
                        <input type="text" class="inp-search" name="keywords" id="keywords" autocomplete="off"
                            placeholder="搜索音乐、MV、歌单、用户">
                        <div class="search-box">
                            <div class="search-menu">
                                <ul class="search-list">
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">1</span>
                                            <p class="search-info">我们的歌</p>
                                            <span class="count">76.5</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">2</span>
                                            <p class="search-info">红尘客栈</p>
                                            <span class="count">176.5</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">3</span>
                                            <p class="search-info">水星记</p>
                                            <span class="count">100.9</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">4</span>
                                            <p class="search-info">林俊杰</p>
                                            <span class="count">44.5</span>
                                        </a>
                                    </li>
                                    <li class="search-items">
                                        <a href="" class="search-links">
                                            <span class="num">5</span>
                                            <p class="search-info">错位时空</p>
                                            <span class="count">106.5</span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </form>
                </div>
                <!-- 用户功能 -->
                <div class="user-functions">
                    <a href="" class="login">登录</a>
                    <div class="user-menu menu-vip menu-list">
                        <span class="menu-content">开通VIP</span>
                        <div class="drop-menu">
                            <a href="" class="drop-menu-links">开通绿钻豪华版</a>
                            <a href="" class="drop-menu-links">开通付费包</a>
                        </div>
                    </div>
                    <div class="user-menu menu-money menu-list">
                        <span class="menu-content">充值</span>
                        <div class="drop-menu">
                            <a href="" class="drop-menu-links">购买乐币</a>
                            <a href="" class="drop-menu-links">充值饭票</a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 子导航 -->
            <div class="subnav">
                <ul class="subnav-list">
                    <li class="subnav-items ">
                        <a href="QQ.html" class="subnav-links">首页</a>
                    </li>
                    <li class="subnav-items active">
                        <a href="singer.html" class="subnav-links">歌手</a>
                    </li>
                    <li class="subnav-items">
                        <a href="Newdisc.html" class="subnav-links">新碟</a>
                    </li>
                    <li class="subnav-items ">
                        <a href="top.html" class="subnav-links">排行榜</a>
                    </li>
                    <li class="subnav-items">
                        <a href=" classify.html " class="subnav-links">分类歌单</a>
                    </li>
                    <li class="subnav-items">
                        <a href="MV.html" class="subnav-links">MV</a>
                    </li>
                    <li class="subnav-items">
                        <a href="radio.html" class="subnav-links">电台</a>
                    </li>
                    <li class="subnav-items">
                        <a href="Album.html" class="subnav-links">数字专辑</a>
                    </li>
                    <li class="subnav-items ">
                        <a href="ticket.html" class="subnav-links">票务</a>
                    </li>
                </ul>
            </div>
        </div>
    </header>
    <!-- 主体 -->
    <main class="main-singer w100">
        <!-- 头部背景 -->
        <div class="singer-bg-box w100">
            <h3 class="singer-bg-title">我关注的歌手</h3>
            <div class="center-box">
                <a href="" class="singer-bg-a">
                    <img src="images/singer/1.webp" alt="" class="singer-bg-pic">
                </a>
                <div class="singer-bg-text">查看全部></div>
            </div>
        </div>
        <!-- 模块 1-->
        <section class="section-choice w100 ">
            <div class="singer-choice w1600">
                <div class="singer-choice-box">
                <ul class="singer-choice-ul">
                    <li class="singer-choice-li active">
                        <a href="" class="singer-choice-a">全部</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">A</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">B</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">C</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">D</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">E</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">F</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">G</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">H</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">I</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">J</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">K</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">L</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">M</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">N</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">O</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">P</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">Q</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">R</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">S</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">T</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">U</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">V</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">W</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">X</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">Y</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">Z</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">#</a>
                    </li>
                </ul>
                <ul class="singer-choice-ul">
                    <li class="singer-choice-li active">
                        <a href="" class="singer-choice-a">全部</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">内地</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">港台</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">欧美</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">日本</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">韩国</a>
                    </li>
                </ul>
                <ul class="singer-choice-ul">
                    <li class="singer-choice-li active">
                        <a href="" class="singer-choice-a">全部</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">男</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">女</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">组合</a>
                    </li>
                </ul>
                <ul class="singer-choice-ul">
                    <li class="singer-choice-li active">
                        <a href="" class="singer-choice-a">全部</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">流行</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">说唱</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">国风</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">摇滚</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">电子</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">民谣</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">R&B</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">民族乐</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">轻音乐</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">爵士</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">古典</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">乡村</a>
                    </li>
                    <li class="singer-choice-li">
                        <a href="" class="singer-choice-a">蓝调</a>
                    </li>
                </ul>
            </div>
            </div>
        </section>
        <!-- 模块 2-->
        <section class="section-list w100 section-singer">
            <div class="singer-list w1600 mb40">
                <ul class="singer-list-ul">
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s1.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">周杰伦</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s2.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">陈奕迅</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s3.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">林俊杰</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s4.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">薛之谦</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s5.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">Zyboy忠宇</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s6.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">王靖雯</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s7.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">王心凌</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s8.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">队长</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s9.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">G.E.M. 邓紫棋</a>
                    </li>
                    <li class="singer-list-li">
                        <a href="" class="singer-list-a">
                            <img src="images/singer/sg/s10.webp" alt="" class="singer-list-pic">
                        </a>
                        <a href="" class="singer-list-name">毛不易</a>
                    </li>
                </ul>
            </div>
        </section>
        <!-- 歌手名字 -->
        <section class="section w100 section-singer">
            <div class="singer-name-list w1600 ">
                <ul class="singer-name-ul">
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">蔡健雅</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张韶涵</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">许嵩</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">李荣浩</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">五月天</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">周深</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">毛不易</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张杰</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">李宇春</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">BEYOND</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">不是火花呀</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">胡彦斌</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">刘大壮</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">房东的猫</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">梁静茹</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">王力宏</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">S.H.E</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">胡歌</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">音阙诗听</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">王杰</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">金志文</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张震岳</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">谭咏麟</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">周华健</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">花粥</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">旺仔小乔</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">任然</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">汪苏泷</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张靓颖</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">孙燕姿</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">杨宗纬</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">A-Lin</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">陈慧娴</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">杨千嬅</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张信哲</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">郁可唯</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">艾辰</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张远</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">蓝心羽</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">时代少年团 </a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">周传雄</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">程佳佳</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">刘若英</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">许巍</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">朴树</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">林宥嘉</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">陈粒</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张国荣</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张芸京</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">于文文</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">阿肆</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">鹿晗</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">李健</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">逃跑计划</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">等什么君</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">王菲</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">徐佳莹</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">莫文蔚</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张碧晨</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">李克勤</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张学友</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">EXO</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">蔡依林</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">刘德华</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">刘惜君</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">杨丞琳</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">方大同</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">陶喆</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">黄霄云</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">田馥甄</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">庄心妍</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">林子祥</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">张宇</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">颜人中</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">李宗盛</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">周杰伦</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">周笔畅</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">叶倩文</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">王赫野</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">吴青峰</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">宋亚轩</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">王以太</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">宋冬野</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">马嘉祺</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">那英</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">牛奶咖啡</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">林忆莲</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">容祖儿</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">陈小春</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">隔壁老樊</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">王俊凯</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">鞠婧祎</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">陈百强</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">周柏豪</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">杨坤</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">谢安琪</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">马思唯</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">筷子兄弟</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">葛东琪</a>
                    </li>
                    <li class="singer-name-li">
                        <a href="" class="singer-name-a">动力火车</a>
                    </li>
                </ul>
            </div>
        </section>
    </main>
    <!-- footer -->
    <footer class="footer w100">
        <div class="footer-wrapper w1600">
            <div class="footer-box">
                <!-- 下载客户端 -->
                <div class="footer-update">
                    <h5 class="footer-title">下载QQ音乐客户端</h5>
                    <ul class="update-list">
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg1"></i>
                                PC版
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg2"></i>
                                Mac版
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg3"></i>
                                Android版
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg4"></i>
                                iPhone版
                            </a>
                        </li>
                    </ul>
                </div>
                <!-- 特色产品 -->
                <div class="footer-product">
                    <h5 class="footer-title">特色产品</h5>
                    <ul class="update-list ">
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg5"></i>
                                全民K歌
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg6"></i>
                                银河音效
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg7"></i>
                                QPlay
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                <i class="update-bg bg8"></i>
                                Fan直播伴侣
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                车载互联
                            </a>
                        </li>
                        <li class="update-items">
                            <a href="" class="update-links">
                                QQ演出
                            </a>
                        </li>
                    </ul>
                </div>
                <!-- 合作链接 -->
                <div class="footer-coolink">
                    <h5 class="footer-title">合作链接</h5>
                    <div class="footer-coolink-box">
                        <a href="" class="footer-box-links">CJ ENM</a>
                        <a href="" class="footer-box-links">腾讯视频</a>
                        <a href="" class="footer-box-links">手机QQ空间</a>
                        <a href="" class="footer-box-links">最新版QQ</a>
                        <a href="" class="footer-box-links">腾讯社交广告</a>
                        <a href="" class="footer-box-links">电脑管家</a>
                        <a href="" class="footer-box-links">QQ浏览器</a>
                        <a href="" class="footer-box-links">腾讯微云</a>
                        <a href="" class="footer-box-links">腾讯云</a>
                        <a href="" class="footer-box-links">企鹅FM</a>
                        <a href="" class="footer-box-links">智能电视网</a>
                        <a href="" class="footer-box-links">当贝市场</a>
                        <a href="" class="footer-box-links">酷我音乐</a>
                        <a href="" class="footer-box-links">酷狗听书</a>
                    </div>
                </div>
                <!-- 开放平台 -->
                <div class="footer-coolink">
                    <h5 class="footer-title">开放平台</h5>
                    <div class="footer-coolink-box">
                        <a href="" class="footer-box-links">QQ音乐开放平台</a>
                        <a href="" class="footer-box-links">腾讯音乐人</a>
                        <a href="" class="footer-box-links">音乐推</a>
                    </div>
                </div>
                <!-- TME集团官网 -->
                <div class="footer-coolink">
                    <h5 class="footer-title">TME集团官网</h5>
                    <div class="footer-coolink-box">
                        <a href="" class="footer-box-links">腾讯音乐</a>
                    </div>
                </div>
            </div>
            <div class="footer-coopyright">
                <div class="coopyright-item">
                    <a href="" class="footer-box-links">关于腾讯 |</a>
                    <a href="" class="footer-box-links">About Tencent |</a>
                    <a href="" class="footer-box-links">服务条款 |</a>
                    <a href="" class="footer-box-links">用户服务协议 |</a>
                    <a href="" class="footer-box-links">隐私政策 |</a>
                    <a href="" class="footer-box-links">权利声明 |</a>
                    <a href="" class="footer-box-links">广告服务 |</a>
                    <a href="" class="footer-box-links">腾讯招聘 |</a>
                    <a href="" class="footer-box-links">客服中心 |</a>
                    <a href="" class="footer-box-links">网站导航</a>
                </div>
                <div class="coopyright-item">
                    Copyright © 1998 - 2022 Tencent.
                    <a href="" class="footer-box-links">All Rights Reserved.</a>
                </div>
                <div class="coopyright-item">
                    腾讯公司
                    <a href="" class="footer-box-links"> 版权所有 |</a>
                    <a href="" class="footer-box-links">营业执照 |</a>
                    网络文化经营许可证：
                    <a href="" class="footer-box-links">粤网文[2020]3396-195号 |</a>
                    客服电话:
                    <a href="" class="footer-box-links">4006016666</a>
                </div>
            </div>
        </div>
    </footer>
    <!-- 侧边栏 -->
    <aside class="side">
        <a href="" class="side-links">
            <i class="side-bg"></i>
        </a>
        <a href="" class="side-links">反馈</a>
        <a href="" class="side-links">
            <i class="side-bg music"></i>
        </a>
    </aside>
</body>

</html>